<template>
  <div>
    <el-button @click="add">新增</el-button>
    <List ref="list" @edit="edit"></List>
    <Info ref="info" :info="info" @update="update"></Info>
  </div>
</template>

<script>
import List from "./List.vue";
import Info from "./Info.vue";
export default {
  data() {
    return {
      info: {
        isShow: false,
        type: "add", // edit
      },
    };
  },
  components: {
    List,
    Info,
  },
  methods: {
    update() {
      // info中更新了数据，需要刷新list
      this.$refs.list.getTableData();
    },
    // 编辑菜单
    edit(data) {
      this.info = {
        isShow: true,
        type: "edit",
      };
      this.$refs.info.setValue({...data});
    },
    // 新增
    add() {
      this.info = {
        isShow: true,
        type: "add",
      };
      this.$refs.info.setValue({
        pid: 0,
        title: "",
        icon: "",
        type: 1,
        url: "",
        status: 1,
      });
    },
  },
};
</script>

<style>
</style>